import CodeBlock from "@theme/CodeBlock";
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";

# @farmfe/plugin-react
Support `React Jsx` and `React Refresh` for Farm.

## Installation

<Tabs>
  <TabItem value="npm" label="npm">
    <CodeBlock>npm install @farmfe/plugin-react react-refresh</CodeBlock>
  </TabItem>
  <TabItem value="yarn" label="yarn">
    <CodeBlock>yarn add @farmfe/plugin-react react-refresh</CodeBlock>
  </TabItem>
  <TabItem value="pnpm" label="pnpm">
    <CodeBlock>pnpm add @farmfe/plugin-react react-refresh</CodeBlock>
  </TabItem>
</Tabs>

## Usage
`@farmfe/plugin-react` is a Rust plugin, you only need to configure its package name in `plugins` field in `farm.config.ts`.
```ts {4}
import { UserConfig } from '@farmfe/core';

const config: UserConfig = {
  plugins: ['@farmfe/plugin-react', { /** options here */}]
}
```

## Options
See [SWC Transform React Options](https://swc.rs/docs/configuration/compilation#jsctransformreact).
